<%-- 
    Document   : AddProvince
    Created on : Aug 3, 2013, 1:22:05 PM
    Author     : ZzCFIzZ
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
    </head>
    <body>
        <form action="AddProvinceServlet" name="Add" onsubmit="return checkFile()" method="post" enctype="multipart/form-data">
            <div>
                <c:if test="${not empty error}">
                    <a style="color: red">${error}</a>
                </c:if>
                <c:if test="${not empty success}">
                    <a style="color: red">${success}</a>
                </c:if>
                    <br/>
                Province Name<br/>
                <input type="text" name="txtName" id="name" value="${name}"/>
                Picture<br/>
                <img src="images/${picture}" id="hinh"/><br/>
                <input type="file" name="txtPicture" accept="image/*" id="file" value="${picture}" onchange="load()"/><br/>
                <input type="submit" name="btAction" value="Add"/>
            </div>
        </form>
    </body>
    <script>
        function load(){
            //            var list=document.getElementById("file").value.split(".");
            //            var df=list[list.length-1];
            //            var k=new RegExp("jpg");
            //            if (!k.test(df)){
            //                alert("Chi cho phep chon file jpg");
            //                return false;
            //            }
            var list=document.getElementById("file").value.split(".");
            var df=list[list.length-1];
            var rawFile = new XMLHttpRequest();
            var c;
            rawFile.open("GET", "checkFile.txt", true);
            rawFile.onreadystatechange = function ()
            {
                if(rawFile.readyState == 4)
                {
                    var allText = rawFile.responseText;
                    c = allText.split("|");
                    for (var i=0;i<c.length;i++){
                        var k=new RegExp(c[i]);
                        if(k.test(df)){
                            return true;
                        }
                    }
                    alert("Chi duoc chon file hinh!!!");
                    return false;
                }
            }
            rawFile.send();
            var path=document.getElementById("file").value.split("/");
            path=document.getElementById("file").value.split("\\");
            document.getElementById("hinh").src="images/"+path[path.length-1];
        }
        function checkFile(){
            var name=document.getElementById("name").value;
            if (name.length<1 || name.length>50){
                alert("Name's length must be between 1 and 50 characters!!!");
                return false;
            }
            var check=/[A-z ]/;
            if(!check.test(name)){
                alert("Name must content character!!!");
            }
            if(document.getElementById("file").value==""){
                alert("Please choose a picture!!!");
                return false;
            }
        }
    </script>
</html>
